// 默认
:root {
    // -----------------------tabs-----------------------------
    --fv-tabs-height:30px; // tabs 高度
    --fv-tabs-bg-color:#F4F4F4; // tabs 背景颜色

    // -----------------------主界面-----------------------------
    // 主界面背景颜色
    --fv-main-bg-color:#F4F4F4;

    // -----------------------顶栏-----------------------------
    --fv-header-height:52px; // 顶栏高度
    --fv-header-bg-color:#214e7a; // 顶栏背景颜色
    --fv-header-text-color:#fff; // 顶栏内容颜色

    // -----------------------侧栏-----------------------------
    --fv-side-bg-color:#012230; // 侧栏背景颜色
    --fv-main-menu-width:75px; // 侧栏主菜单宽度
    --fv-menu-width:200px; // 侧栏菜单宽度

    // -----------------------菜单-----------------------------
    --fv-menu-text-color:#ffffff; // 菜单内容颜色
    // --fv-menu-active-bg-color: #b8d8f6; // 激活项的菜单背景颜色
    --fv-menu-active-color: var(--el-color-primary); // 激活项的菜单文本颜色
    --fv-menu-hover-bg-color: #12304e; // 鼠标移入菜单背景颜色
    --fv-menu-inline-bg-color:rgba(0, 18, 25, 1); // 子菜单展开背景颜色
    --fv-menu-item-height: 60px; // 侧栏菜单项高度（包括双侧栏布局的主菜单项）
    --fv-menu-item-font-size: var(--el-font-size-base); // 菜单字体尺寸
    
    // -----------------------LOGO标题-----------------------------
    --fv-logo-bg-color:#012230; // LOGO背景
    --fv-logo-title-color:#ffffff; //标题颜色

    // -----------------------页脚-----------------------------
    --fv-footer-heigth:26px; // 页脚高度
    --fv-footer-bg-color:#f4f4f4; // 页脚背景颜色
    --fv-footer-text-color:#909399; // 页脚文本颜色
    --fv-footer-font-size:14px; // 页脚字体尺寸
    
    // -----------------------顶栏工具栏-----------------------------
    --fv-tools-hover-bg-color:rgba(5, 106, 247, 0.103); // 鼠标移入背景
    

}
// 暗黑模式
html.dark{
    // -----------------------tabs-----------------------------
    --fv-tabs-bg-color:#141414; // tabs 背景颜色

    // -----------------------主界面-----------------------------
    // 主界面背景颜色
    --fv-main-bg-color:#1F1F1F;
    
    // -----------------------顶栏-----------------------------
    --fv-header-bg-color:#191919; // 顶栏背景颜色
    --fv-header-text-color:#CFD3DC; // 顶栏内容颜色

    // -----------------------侧栏-----------------------------
    --fv-side-bg-color:#191919; // 侧栏背景颜色

    // -----------------------菜单-----------------------------
    --fv-menu-text-color:#CFD3DC; // 菜单内容颜色
    // --fv-menu-active-bg-color: #b8d8f6; // 激活项的菜单背景颜色
    --fv-menu-active-color: var(--el-color-primary); // 激活项的菜单文本颜色
    --fv-menu-hover-bg-color: #000; // 鼠标移入菜单背景颜色
    --fv-menu-inline-bg-color:#080808; // 子菜单展开背景颜色
    --fv-menu-item-font-size: var(--el-font-size-base); // 菜单字体尺寸
    
    // -----------------------LOGO标题-----------------------------
    --fv-logo-bg-color:#191919; // LOGO背景
    --fv-logo-title-color:#CFD3DC; //标题颜色

    // -----------------------页脚-----------------------------
    --fv-footer-bg-color:#191919; // 页脚背景颜色
    --fv-footer-text-color:#CFD3DC; // 页脚文本颜色
    
    // -----------------------工具栏-----------------------------
    --fv-tools-hover-bg-color:rgba(5, 106, 247, 0.103); // 鼠标移入背景


}
// 灰色模式
html.gray {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
}
// 色弱模式
html.webkit{
    filter: invert(80%);
    -webkit-filter: invert(80%); 
}


